import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import { AppContainer } from 'react-hot-loader';
import { observer, Provider } from 'mobx-react';

import './index.css';
import registerServiceWorker from './registerServiceWorker';

import PageNav from './views/PageNav/PageNav';
import App from './App';
// 注册
import Certification from './views/Register/Certification/Certification';
import Agreement from './views/Register/Agreement/Agreement';
import SetUsername from './views/Register/SetUsername/SetUsername';
// 登录
import MsgLogin from './views/Login/MsgLogin/MsgLogin';
import PwdLogin from './views/Login/PwdLogin/PwdLogin';
import ResetPwd from './views/Login/ResetPwd/ResetPwd';

function resetRem() {
	// let factor = document.documentElement.clientWidth / 320;
	// window.scaleFactor = factor;
	// document.documentElement.style.fontSize = 10 * factor + 'px'
	document.documentElement.style.fontSize = document.documentElement.clientWidth / 12.24 + 'px';
}

resetRem();

@observer
class PageRoute extends React.Component {
	render() {
		return (
			<AppContainer>
				<Router >
					<React.Fragment>
						<PageNav />
						<Route exact path="/" component={App} />
						<Route path="/Register_Certification" component={Certification} />
						<Route path="/Register_Agreement" component={Agreement} />
						<Route path="/Register_SetUsername" component={SetUsername} />
						<Route path="/Login_MsgLogin" component={MsgLogin} />
						<Provider store={{ a: "hello" }}>
							<Route path="/Login_PwdLogin" component={PwdLogin} />
						</Provider>
						<Route path="/Login_ResetPwd" component={ResetPwd} />
					</React.Fragment>
				</Router>
			</AppContainer>
		)
	}
}

function render(App) {
	ReactDOM.render(
		<App />
		, document.getElementById('root')
	);
}

render(PageRoute);

if (module.hot) {
	module
		.hot
		.accept(PageRoute, () => {
			render(PageRoute)
		});
}

registerServiceWorker();
